import Vue from 'vue'
import Router from 'vue-router'
import Home from './views/Home.vue'

import DataSourceHome from './views/datasource/DataSource.vue';
import DataSourceEdit from './views/datasource/DataSourceEdit.vue'

import Query from './views/query/Query.vue'
import QueryEdit from './views/query/QueryEdit.vue'
import TemplateSelect from './views/report/TemplateSelect.vue'
import QuerySelect from './views/report/QuerySelect.vue'
import RelativeSelect from './views/report/RelativeEdit.vue'
import ReportNameEdit from './views/report/ReportNameEdit.vue'
import ReportList from './views/report/ReportList.vue'

import ReportReview from './views/report/ReportReview.vue'

import ReportReviewItem from './views/report/ReportReviewItem.vue'

import About from './views/About.vue';
import LayoutEdit from './views/layout/LayoutEdit.vue'
import LayoutEditContainer from './views/layout/LayoutEditContainer.vue'
import AlbumList from './views/layout/AlbumList.vue'
import AlbumReview from './views/layout/AlbumReview.vue'



Vue.use(Router)

export default new Router({
  routes: [
    {
      path: '/',
      name: 'home',
      component: Home
    },
    {
      path:'/albumReview',
      component:AlbumReview,
      props: (route) => ({ albumId: route.query.albumId })
    },
    {
      path:'/albumList',
      component:AlbumList
    },
    {
      path:'/layoutEdit',
      name:'layoutEdit',
      component:LayoutEdit
    },

    {
      path:'/layoutEditContainer',
      name:'layoutEditContainer',
      component:LayoutEditContainer,
      props: (route) => ({ albumId: route.query.albumId })
    },

    {
      path:'/query',
      component:Query
    },
    {
      path:'/queryEdit',
      component:QueryEdit

    },
    {
      path:'/about',
      component:About
    },
    {
      path:'/reportList',
      component:ReportList
    },

    {
      path:'/reportReview',
      component:ReportReview,
      props: (route) => ({ reportId: route.query.reportId })
    },
    {
      path:'/reportReviewItem',
      component:ReportReviewItem,
      props: (route) => ({ reportId: route.query.reportId })
    },
    

    {
      path:'/templateSelect',
      component:TemplateSelect,
      props: (route) => ({ reportInfo: route.query.reportInfo })
    },
    {
      path:'/querySelect',
      component:QuerySelect,
      props: (route) => ({ selectedTemplate: route.query.selectedTemplate ,reportInfo: route.query.reportInfo })
    },

    {
      path:'/relativeSelect',
      component:RelativeSelect,
      props: (route) => ({ selectedTemplate: route.query.selectedTemplate ,selectedQuery:route.query.selectedQuery,reportInfo: route.query.reportInfo })
    },
    {
      path:'/reportNameEdit',
      component:ReportNameEdit
    },
    {
      path: '/datasourceHome',
      name: 'datasourceHome',
      component: DataSourceHome
    },
    { 
      path:'/datasourceEdit',
      name:'datasourceEdit',
      component:DataSourceEdit,
      props: (route) => ({ type: route.query.type,id:  route.query.id  })

    },
    {
      path: '/about',
      name: 'about',
      // route level code-splitting
      // this generates a separate chunk (about.[hash].js) for this route
      // which is lazy-loaded when the route is visited.
      component: () => import(/* webpackChunkName: "about" */ './views/About.vue')
    }
  ]
})
